﻿/**
* 标题：空白节点问题
* 现象：Firefox会认为空白、换行等文本信息也当做childNodes中的一员，而IE则会忽悠它们。
* 方法：使用nextSibling属性、nodeType==1解决浏览器的差异问题。
*/
function getNextNode(node) {
	node = typeof node == "string" ? document.getElementById(node) : node;
	if(!nextNode) return null;
	if(!document.all) {
		while(true) {
			if(nextNode.nodeType == 1) {
				break;
			}
			else {
				if(nextNode.nextSibling) {
					nextNode = nextNode.nextSibling;
				}
				else {
					break;
				}
			}
		}
	}
	return nextNode;
}
//@test
//var nextNode = getNextNode("item1");
//alert(nextNode.id);
//var nextNode2 = getNextNode("item2");
//alert(nextNode2.id);

/**
* 标题：透明度问题
* 现象：ie下透明需要通过滤镜实现，而在firefox下透明度是通过css的opacity属性实现。
* 方法：ie: filter: alpha(opacity=20), firefox：opacity: 0.2
*/
function setOpacity(node, level) {
	node = typeof node == "String" ? document.getElementById(node) : node;
	if(document.all) {
		node.style.filter = 'alpha(opacity=' + level + ')';
	} else {
		node.style.opacity = level / 100;
	}
}
//@test
//setOpacity("test1", 20);
//setOpacity("test2", 80);

/**
* 标题：event兼容问题
* 现象：1.ie下event对象是作为window的属性作用于全局作用域， 而在firefox下event对象是作为事件的参数存在的。2.派生事件的对象在ie下是通过event对象的srcElement属性访问的，在firefox下，是通过对旬的target属性访问的。
* 方法：
*/
function getEventTarget(e) {
	e = window.event || e;
	return e.srcElement || e.target;
}
//@test
/*
document.getElementById("wrapper").onclick = function(e) {
	var node = getEventTarget(e);
	alert(node.tagName);
}
*/

/**
* 标题：事件冒泡问题
* 概念：javascript对先触发子容器监听事件，后触发父容器监听事件的现象称为事件的冒泡。
* 现象：实现阻止冒泡ie是通过设置event对象的cancelBubble属性为true实现的，而在firefox下则是通过调用event对象的stopPropagation方法实现的。
* 方法：
*/
function stopPropagation(e) {
	e = window.event || e;
	if(docement.all) {
		e.cancelBubble = true;
	}
	else {
		e.stopPropagation();
	}
}
//@test
/*
var infoBox = document.getElementById("infoBox"), wrapper = document.getElementById("wrapper"), btn = document.getElementById("btn");
wrapper.onclick = function() {
	infoBox.innerHTML = "1";
}
btn.onclick = function() {
	infoBox.innerHTML = "2";
	stopPropagation(e);
}
*/